<!--

/*
* Copyright (C) 2005-2013 University of Sydney
*
* Licensed under the GNU License, Version 3.0 (the "License"); you may not use this file except
* in compliance with the License. You may obtain a copy of the License at
*
* http://www.gnu.org/licenses/gpl-3.0.txt
*
* Unless required by applicable law or agreed to in writing, software distributed under the License
* is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
* or implied. See the License for the specific language governing permissions and limitations under
* the License.
*/

/**
* brief description of file
*
* @author      Tom Murtagh
* @author      Kim Jackson
* @author      Ian Johnson   <ian.johnson@sydney.edu.au>
* @author      Stephen White   <stephen.white@sydney.edu.au>
* @author      Artem Osmakov   <artem.osmakov@sydney.edu.au>
* @copyright   (C) 2005-2013 University of Sydney
* @link        http://Sydney.edu.au/Heurist
* @version     3.1.0
* @license     http://www.gnu.org/licenses/gpl-3.0.txt GNU License 3.0
* @package     Heurist academic knowledge management system
* @subpackage  !!!subpackagename for file such as Administration, Search, Edit, Application, Library
*/

-->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8">
		<title>Temporal Object</title>
		<style type="text/css">
			/*margin and padding on body element
			  can introduce errors in determining
			  element position and are not recommended;
			  we turn them off as a foundation for YUI
			  CSS treatments. */
			body {
				margin:0;
				padding:0;
			}
			.date-button {
				margin: 3px;
				width: 24px;
				height: 18px;
				background: url(../images/cal.gif) lightgray scroll center center no-repeat;
			}
		</style>


		<!--link rel="stylesheet" type="text/css" href="../../external/yui/2.7.0/build/fonts/fonts-min.css" />
		<link rel="stylesheet" type="text/css" href="../../external/yui/2.7.0/build/tabview/assets/skins/sam/tabview.css" />
		<link rel="stylesheet" type="text/css" href="../../external/yui/2.7.0/build/calendar/assets/skins/sam/calendar.css" />

		<script type="text/javascript" src="../../external/yui/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>

		<script type="text/javascript" src="../../external/yui/2.7.0/build/element/element-beta-min.js"></script>
		<script type="text/javascript" src="../../external/yui/2.7.0/build/tabview/tabview-min.js"></script>
		<script type="text/javascript" src="../../external/yui/2.7.0/build/calendar/calendar-min.js"></script-->

		<link rel="stylesheet" type="text/css" href="../../external/yui/2.8.2r1/build/fonts/fonts-min.css" />
		<link rel="stylesheet" type="text/css" href="../../external/yui/2.8.2r1/build/tabview/assets/skins/sam/tabview.css" />
		<link rel="stylesheet" type="text/css" href="../../external/yui/2.8.2r1/build/calendar/assets/skins/sam/calendar.css" />

		<link rel="stylesheet" type="text/css" href="../../common/css/calendar.css" />

		<script type="text/javascript" src="../../external/yui/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js"></script>

		<script type="text/javascript" src="../../external/yui/2.8.2r1/build/element/element-min.js"></script>
		<script type="text/javascript" src="../../external/yui/2.8.2r1/build/tabview/tabview-min.js"></script>

		<script type="text/javascript" src="../../external/jquery/jquery.js"></script>

		<!--script>
			Timeline_ajax_url="../../external/timeline/timeline_ajax/simile-ajax-api.js?bundle=false";
			Timeline_urlPrefix='../../external/timeline/timeline_js/';
			Timeline_parameters='bundle=false';
		</script>
		<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/calendar/calendar-min.js"></script>
		<script src="../../external/timeline/timeline_js/timeline-api.js" type="text/javascript"></script-->
		<script type="text/javascript" src="../../common/js/hintDiv.js"></script>

        <script type="text/javascript" src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.js"></script>
        <script type="text/javascript" src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.plus.js"></script>

        <link rel="stylesheet" type="text/css" href="../../external/js/jquery.calendars-1.2.1/jquery.calendars.picker.css">
        <script type="text/javascript" src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.picker.js"></script>

        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.taiwan.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.thai.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.julian.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.persian.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.islamic.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.ummalqura.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.hebrew.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.ethiopian.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.coptic.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.nepali.js"></script>
        <script src="../../external/js/jquery.calendars-1.2.1/jquery.calendars.mayan.js"></script>
        <style>
            .calendars-jumps .calendars-cmd-prev, .calendars-jumps .calendars-cmd-next { width: 20%; }
        </style>
	</head>
    
	<body class=" yui-skin-sam" style="background-color:rgb(240,240,240);" width=440 height=420 >

		<script type="text/javascript" src="../../common/js/calendarViewer.js"></script>
		<script type="text/javascript" src="../../common/js/calendar.js"></script>

		<div id=display-div class="yui-navset">
			<ul class="yui-nav">
				<li><a href="#s"><em>Simple Date</em></a></li>
				<li class="selected"><a href="#p"><em>Date Range</em></a></li>
				<li><a href="#f"><em>Aproximate Date</em></a></li>
				<li><a href="#c"><em>C14 Date</em></a></li>

			</ul>
            
			<div class="yui-content" style="background-color:rgb(240,240,240); border:0;">
				<div id="s">
					<div style="margin: 20px  0px 0px 50px">
						<div>
							<span title="Enter date in  y-m-d">
							    Date:&nbsp;<input type=text id="simpleDate" style="width:150px;" class="withCalendarsPicker" />
							    <!-- <input type=button class="date-button" id="calendar" onclick="calendarPopup(this);" /> -->
							</span>
						</div>
						<div style="margin:5px 0px 15px 35px; font-size:8pt; color:grey;"  >
							<span >Year(eg.1624) of calendar date (yyyy-mm or yyyy-mm-dd)</span><br/>
							<span >use minus(-) for BCE dates(eg. -375 for 375 BCE)</span>
						</div>
					</div>
                    
					<div style="border-top:1px solid lightgrey; margin :0px 10px"></div>
                    
					<div style="margin: 15px  0px 0px 50px">
						<div>
							<span title="Enter time in  h:m:s">
								Time:&nbsp;<input type=text id="simpleTime" style="width:80px;" />
								<span style="font-size:8pt; color:grey;">&nbsp;(optional)</span>
							</span>
                            
							<span title="Enter Time Zone offset starting with hours only enter minute for non-zero" style="margin:0px 30px">
								Time Zone:&nbsp;<u>+</u>
								<input type=text id="tzone" title="Time Zone Adjust hours (-12 to +12)" style="width:60px;" />
								<span style="font-size:8pt; color:grey;">&nbsp;(optional)</span>
							</span>
						</div>
                        
						<div style="margin:5px 0px 15px 35px; font-size:8pt; color:grey;"  >
							<span>hh or hh:mm or hh:mm:ss</span>
							<span style="margin: 0px 120px;">+ for east (Europe,Africa,Asia)</span><br/>
							<span style="margin: 0px 0px 0px 245px;">- for west (N &amp; S America)</span>
						</div>
					</div>
                    
					<div style="border-top:1px solid lightgrey; margin :0px 10px"></div>
                    
					<div id="deterDiv" style="float:left;margin:0px 0px 0px 57px;">
						Type of Determination<br/>
                        
						<span style="font-size:8pt; color:grey;">
						    How were the dates arrived at?
						</span>
                        
						<div style="margin:10px 25px;">
							<input type="radio" name="sDET"  value="0" checked="checked" />Unknown<br/>
							<input type="radio" name="sDET" value="1"/>Attested<br/>
							<input type="radio" name="sDET"  value="2"/>Conjecture<br/>
							<input type="radio" name="sDET"  value="3"/>Measurement
						</div>
					</div>
				</div>

				<div id="p">
					<div style="margin:20px 0px 10px 60px;">
						<canvas id="dRangeCanvas" width="530" height="80"></canvas>
					</div>
					<div style="margin-left:30px;">
						<div>
							<span title="Enter only the known values starting with year" style=" margin:0px 5px;">
								<input type=text id="TPQ" style="width:95px;" class="withCalendarsPicker"/>
							</span>
                            
							<span title="Press to set Probable begin equal to TPQ" style=" margin:0px 5px;">
								<input type=button id="setPDB" value="set =>" onclick="setPDBtoTPQ();" style="font-size: 7pt; width:35px;" />
							</span>
                            
							<span title="Enter only the known values starting with year" style=" margin:0px 5px;">
								<input type=text id="PDB" style="width:95px;" class="withCalendarsPicker"/>
							</span>
                            
							<img style="width:30px; height:1px; border-top: 2px solid grey; margin:0px 5px;"/>
                            
							<span title="Enter only the known values starting with year" style=" margin:0px 5px;">
								<input type=text id="PDE" style="width:95px;" class="withCalendarsPicker"/>
							</span>
                            
							<span title="Press to set Probable end equal to TAQ" style=" margin:0px 5px;">
								<input type=button id="setPDE" value="<= set" onclick="setPDEtoTAQ();" style="font-size: 7pt; width:35px;"/>
							</span>
                            
							<span title="Enter only the known values starting with year" style=" margin:0px 5px;">
								<input type=text id="TAQ" style="width:95px;" class="withCalendarsPicker"/>
							</span>
						</div>
                        
						<div>
							<span style="margin:5px 0px 15px 5px; font-size:8pt; color:grey;"> Terminus Post Quem </span>
							<span style="margin:5px 0px 15px 75px; font-size:8pt; color:grey;"> Probable begin </span>
							<span style="margin:5px 0px 15px 95px; font-size:8pt; color:grey;"> Probable End </span>
							<span style="margin:5px 0px 15px 72px; font-size:8pt; color:grey;"> Terminus Ante Quem </span>
						</div>
					</div>
                    
					<div style="margin:20px 0px 20px 80px;">
						<span id="pSProfDiv">
							<label for="SPF" title="Select the profile">Start Profile:</label>
							<select id="SPF">
								<option label="Flat"  selected value=0>Flat</option>
								<option label="Central" value=1>Central Tendancy</option>
								<option label="Slow Start" value=2>Slow Start</option>
								<option label="Slow Finish" value=3>Slow Finish</option>
							</select>
						</span>
                        
						<img style="height:1px; margin:0px 70px;"/>
                        
						<span id="pEProfDiv">
							<label for="EPF" title="Select the profile">End Profile:</label>
							<select id="EPF">
								<option label="Flat"  selected value=0>Flat</option>
								<option label="Central" value=1>Central Tendancy</option>
								<option label="Slow Start" value=2>Slow Start</option>
								<option label="Slow Finish" value=3>Slow Finish</option>
							</select>
						</span>
					</div>
                    
					<div style="margin:10px 20px; ">
						<div style="border: 1px solid grey; float:left; width:300px; padding:10px;" >
							<b>Entering dates</b><br/>
							<span style="font-size:8pt; color:grey;">Year(eg.1624) of calendar date (yyyy-mm or yyyy-mm-dd)<br/>
							use minus(-) for BCE dates(eg. -375 for 375 BCE)</span><br/><br/>
							<b>Start &amp; End profile</b><br/>
							<span style="font-size:8pt; color:grey;">What is the distribution of the likelihood of the date<br/>
							between the terminus date and the probable date<br/>
							(if in doubt, choose flat, that is any point is equally likely).</span><br/>
						</div>
                        
						<div id="deterDiv" style="float:left;margin:0px 0px 0px 57px;">
							Type of Determination<br/>
							<span style="font-size:8pt; color:grey;">
							How the dates arrived at?
							</span>
							<div style="margin:10px 25px;">
								<input type="radio" name="pDET"  value="0" checked="checked" />Unknown<br/>
								<input type="radio" name="pDET" value="1"/>Attested<br/>
								<input type="radio" name="pDET"  value="2"/>Conjecture<br/>
								<input type="radio" name="pDET"  value="3"/>Measurement
							</div>
						</div>
					</div>
				</div>

				<div id="f">
					<div style="margin:20px 0px 20px 50px; ">
						<div style="float:left; width:430px;">
							<div>
								<span title="Enter date in  y-m-d">
								    Approximate date&nbsp;<input type=text id="fDAT" style="width:150px;" class="withCalendarsPicker"/>
								</span>
							</div>
                            
							<div style="font-size:8pt; color:grey; margin:5px 0px 15px 105px;">
								<span >Year(eg.1624) of calendar date (yyyy-mm or yyyy-mm-dd)</span><br/>
								<span >use minus(-) for BCE dates(eg. -375 for 375 BCE)</span>
							</div>
                            
							<div>
								<div title="Enter duration in  PnYnMnDTnHnMnS format">
									<span style="margin-right:50px">Range</span>
									<u>+</u>&nbsp;&nbsp;<input type=text id="fRNG" style="width:50px; margin-right:5px" />
									<select id="level">
										<option label="Year"  selected value="Y">Year</option>
										<option label="Month" value="M">Month</option>
										<option label="Day" value="D">Day</option>
									</select><br/>
								</div>
								<div style="font-size:8pt; color:grey; margin: 5px 0px 15px 105px;">
									Actual date is assumed to lie withinthis range.
								</div>
							</div>
                            
							<div id="fProfDiv" >
								<label for="fPRF" title="Select the profile">Probability curve &nbsp;</label>
								<select id="fPRF">
									<option label="Flat"  selected value=0>Flat</option>
									<option label="Central" value=1>Central Tendancy</option>
									<option label="Slow Start" value=2>Slow Start</option>
									<option label="Slow Finish" value=3>Slow Finish</option>
								</select><br/>
								<div style="font-size:8pt; color:grey; margin: 5px 0px 0px 105px;">
									Distribution of the likelihood of the date between the limits set by the range.
								</div>
							</div>
						</div>
                        
						<div id="fdeterDiv" style="float:left;margin:0px 0px 0px 57px;">
							Source of the estimate<br/>
							<span style="font-size:8pt; color:grey;">
							    How the dates arrived at?
							</span>
                            
							<div style="margin:10px 25px;">
								<input type="radio" name="fDET"  value="0" checked="checked" />Unknown<br/>
								<input type="radio" name="fDET" value="1"/>Attested<br/>
								<input type="radio" name="fDET"  value="2"/>Conjecture<br/>
								<input type="radio" name="fDET"  value="3"/>Measurement
							</div>
						</div>
					</div>
				</div>

				<div id="c">
					<div style="margin:20px 0px 20px 50px;">
						Mean Date:
						<input type=text id="BCE" title="Enter date in  y-m-d h:m:s" tabindex="1" onclick="return c14DateClick('BCE');" style="width:80px; margin: 0px 5px" />
						<span style="margin:0px 15px 0px 15px" >or</span>
							<input type=text id="BPD" title="Enter date in  y-m-d h:m:s" tabindex="-1" onclick="return c14DateClick('BPD');" style="width:80px; margin: 0px 5px 0px 0px" />
						<br/>
						<span style="margin:5px 10px 15px 78px; font-size:8pt; color:grey;"> Years BCE </span>
						<span style="margin:5px 0px 15px 55px; font-size:8pt; color:grey;"> Years BP </span>
					</div>
                    
					<div style="margin:20px 0px 20px 50px;">
						<span title="Enter duration in  PnYnMnDTnHnMnS format" style=" margin:0px 25px 0px 65px">±
							<input type=text id="DEV" onclick="return c14DevClick('DEV');" tabindex="2" style="width:50px; margin:0px 25px 0px 1px" />or
						</span>
						<span title="Enter duration in  PnYnMnDTnHnMnS format">+
							<input type=text id="DVP" onclick="return c14DevClick('DVP');" tabindex="-1" style="width:50px; margin:0px 9px 0px 1px" />
						</span>
						<span title="Enter duration in  PnYnMnDTnHnMnS format">-
							<input type=text id="DVN" onclick="return c14DevClick('DVP');" tabindex="-1" style="width:50px; margin:0px 0px 0px 4px" />
						</span><br/>
						<span style="margin:5px 10px 15px 80px; font-size:8pt; color:grey;">Std dev</span>
						<span style="margin:5px 10px 15px 70px; font-size:8pt; color:grey;">Pos dev </span>
						<span style="margin:5px 0px 15px 20px; font-size:8pt; color:grey;">Neg dev</span>
					</div>
                    
					<div style="margin:20px 0px 20px 50px;">
						Lab Code:
						<input type=text id="COD" tabindex="4" title="Enter Lab Code" style="width:100px; margin: 0px 5px 0px 14px" />
						<span style="margin:0px 30px 0px 15px" >
							<input type="checkbox" tabindex="5" id="CAL" />Calibrated
						</span>
					</div>
				</div>
			</div>
		</div>
        
		<div>
			<span style="margin:10px 270px">&nbsp;</span>
			<span>
				<input type="button" tabindex="11" value="Save" onclick="TemporalPopup.close();" />
				<input type="button" tabindex="12" value="Cancel" onclick="TemporalPopup.cancel();" />
			</span>
		</div>
        
		<div style="border-top:1px solid grey; margin :10px 10px"></div>
        
		<div style="margin: 10px 0px 0px 20px">
            <div title="Select calendar">
                <div style="width:200px;float:left;text-align:right;">Use calendar:</div>
                    <select id="selectCLD">
                        <option value="gregorian">Gregorian</option>
                        <option value="taiwan">Taiwan</option>
                        <option value="thai">Thai</option>
                        <option value="julian">Julian</option>
                        <option value="persian">Persian</option>
                        <option value="islamic">Islamic</option>
                        <option value="ummalqura">Umm al-Qura</option>
                        <option value="hebrew">Hebrew</option>
                        <option value="ethiopian">Ethiopian</option>
                        <option value="coptic">Coptic</option>
                        <option value="nepali">Nepali</option>
                        <option value="mayan">Mayan</option>
                    </select>
                    <span id="dateGregorian"></span>
            </div>
            
			<div title="Enter comment for this temporal or ">
				<div style="width:200px;float:left;text-align:right;">Comment/original information:</div>
				<input type=text id="COM" tabindex="10" style="width:300px;" />
			</div>
            
			<div style="margin:5px 0px 15px 175px; font-size:7pt; color:grey;"  >
				<span >Temporal objects are converted to a standard format.</span><br/>
				<span >This field is stored in the temporal to record the original values entered.</span>
			</div>
		</div>
        
		<script type="text/javascript" src="../js/temporalObjectLibrary.js"></script>
        <script type="text/javascript" src="editTemporalObject.js"></script>
	</body>
</html>

